/**
 * 解构赋值
 *  ● 数组的解构赋值
 *  ● 对象的解构赋值
 *  ● 解构赋值 默认值
 *  ● 解构赋值 函数形参
 *  ● 解构赋值 + 展开运算符
 */

// 数组的解构赋值 >>>
const arr = [1, 'A', { username: '张智琦' }, ['Hello world!']]
const [
  num,
  letter,
  { username }, // 嵌套对象的解构赋值
  [word], // 嵌套数组的解构赋值
  other // 超出数组范围，默认值
] = arr
console.log(num) // 1
console.log(letter) // A
console.log(username) // 张智琦
console.log(word) // Hello world!
console.log(other) // undefined
// 数组的解构赋值 <<<

// 对象的解构赋值 >>>
const obj = {
  username: '张智琦',
  age: 18,
  contactInformation: {
    phoneNumber: '18336852645',
    email: 'chi_account@163.com'
  },
  hobby: ['吃饭', '睡觉']
}
const {
  username: username2, // 解构赋值并重命名
  age,
  contactInformation: { phoneNumber, email }, // 嵌套对象的解构赋值
  hobby: [hobby1, hobby2] // 嵌套数组的解构赋值
} = obj
console.log(username2)
console.log(age)
console.log(phoneNumber)
console.log(email)
console.log(hobby1)
console.log(hobby2)
// 对象的解构赋值 <<<

// 解构赋值 默认值 >>>
const obj2 = {}
const { username3 = 'username3' } = obj2
console.log(username3)
// 解构赋值 默认值 <<<

// 解构赋值 函数形参 >>>
const obj3 = {
  username: '张智琦',
  age: 18
}
function fn({ username, age }) {
  console.log(username)
  console.log(age)
}
fn(obj3)
// 解构赋值 函数形参 <<<

// 解构赋值 + 展开运算符 >>>
const arr2 = ['A', 'B', 'C']
const [letterA, ...leftLetters] = arr2
console.log(letterA) // A
console.log(leftLetters) // [ 'B', 'C' ]
// 解构赋值 + 展开运算符 <<<
